<template>
    <div>
        <el-table v-loading="pageLoading" :data="list" border fit highlight-current-row @selection-change="handleSelect">
            <div slot="empty">{{emptyText}}</div>
            <el-table-column v-if="showSelector" type="selection" width="55" align="center"/>
            <el-table-column v-if="showIndex" label="序号" fixed="left" type="index" :index="indexMethod" align="center"
                             width="65"/>
            <slot/>
        </el-table>
        <div class="minwidth">
            <pagination v-show="total>0" :total="total" :page.sync="pageQuery.pageNumber"
                        :limit.sync="pageQuery.pageSize" @pagination="handleTableData"/>
        </div>
    </div>
</template>

<script>
    import Pagination from '@/components/Pagination'

    export default {
        name: "PageTable",
        components: {
            Pagination
        },
        props: {
            showSelector: {
                type: Boolean,
                default: true
            },
            showIndex: {
                type: Boolean,
                default: true
            },
            emptyText: {
                type: String,
                default: '暂无数据'
            },
            queryMethod: {
                type: Function,
            },
            queryForm: {
                type: Object,
                default: {}
            },
        },
        data() {
            return {
                pageLoading: false,
                list: [],
                total: 0,
                pageQuery: {
                    pageNumber: 1,
                    pageSize: 10
                },
                selects: []
            }
        },
        methods: {
            indexMethod(index) {
                return (this.pageQuery.pageNumber - 1) * this.pageQuery.pageSize + index + 1;
            },
            //获取表格数据
            handleTableData(pages) {
                this.pageLoading = true
                if (pages) {
                    this.pageQuery.pageNumber = pages.page
                }
                this.queryMethod({
                    ...this.queryForm,
                    pageNumber: this.pageQuery.pageNumber,
                    pageSize: this.pageQuery.pageSize
                }).then(res => {
                    this.list = res.data.list || [];
                    this.total = res.data.total * 1
                }).finally(() => {
                    this.pageLoading = false
                })
            },
            refresh(){
                this.handleTableData();
            },
            reset(){
                this.pageQuery.pageNumber = 1;
                this.handleTableData();
            },
            handleSelect(selection){
                this.selects = selection;
            }
        }
    }
</script>

<style scoped>

</style>
